import { CrisisService } from './../crisis.service';
import { Crisis } from './../crisis';

import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';

@Component({
  selector: 'app-crisis-list',
  templateUrl: './crisis-list.component.html',
  styleUrls: ['./crisis-list.component.css']
})
export class CrisisListComponent implements OnInit {

  // 选中的英雄
  selectedId = 0;

  // onSelect(hero: Hero): void{
  //    this.selectedHero = hero
  //     /**
  //      * 在字符串中传递参数时，有两个注意点:
  //      * 1.需要用反单引号，这样才能识别参数
  //      * 2.用${}来传递，和mybatis类似，只不过用$，可能是为了区分
  //      * */
  //    this.messageService.add(`HeroesComponent：Selected Hero Id = ${hero.id}`)
  // }



  // 英雄数组
  crises: Crisis[]= []

  getCrises(){

    this.selectedId = Number(this.route.snapshot.paramMap.get('id'))
     // 在订阅时subscribe里面的回调函数连函数的()都可以不用写
     this.crisisService.getCrises().subscribe(

       crises => this.crises = crises
     )
  }

  add(name:string): void{
     // 先去掉空格，若为空，则本来就为空
     name = name.trim()
     if(!name) return
     this.crisisService.addCrisis({name} as Crisis)
      .subscribe(crisis => this.crises.push(crisis))
  }

  deleteCrisis(crisis: Crisis): void{
     this.crises = this.crises.filter(c => c !== crisis)
     this.crisisService.deleteCrisis(crisis).subscribe()
  }

  constructor(private crisisService: CrisisService, private route: ActivatedRoute) { }

  ngOnInit(): void {
     this.getCrises()
  }

}
